<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">

<title>Toolbar Test</title>
<link type="text/css" rel="stylesheet" href="templates/HtmlToolbar.css"/>

<script type="text/javascript">
var djConfig = {
	isDebug: true,
	ieClobberMinimal : true
};
</script>
<script type="text/javascript" src="../../dojo.js"></script>
<script type="text/javascript">
	dojo.require("dojo.widget.*");
	dojo.require("dojo.widget.Toolbar");
	dojo.require("dojo.widget.ColorPalette");
</script>

<script type="text/javascript">

function img(name) {
	return dojo.uri.dojoUri("src/widget/templates/buttons/" + name + ".gif").toString();
}

function init(e) {
	var now = new Date();
	tc = dojo.widget.createWidget("ToolbarContainer");
	document.body.insertBefore(tc.domNode, document.body.firstChild);
	tb = dojo.widget.createWidget("Toolbar");
	tc.addChild(tb);
	var bg = dojo.widget.createWidget("ToolbarButtonGroup", {
		name: "justify",
		defaultButton: "justifyleft",
		preventDeselect: true
	});
	bg.addChild(img("justifyleft"));
	bg.addChild(img("justifycenter"));
	bg.addChild(img("justifyright"));
	bg.addChild(img("justifyfull"));
	var items = [img("bold"), img("italic"), img("underline"),
		"|", dojo.widget.createWidget("ToolbarColorDialog", {toggleItem: true, icon: new dojo.widget.Icon(img("backcolor"))}), img("forecolor"),
		"|", bg, //["justify", img("justifyleft"), img("justifycenter"), img("justifyright"), img("justifyfull")],
		"|", img("createlink"), img("insertimage"),
		"|", img("indent"), img("outdent"),
		img("insertorderedlist"), img("insertunorderedlist"),
		"|", img("undo"), img("redo")];
	for(var i = 0; i < items.length; i++) {
		tb.addChild(items[i], null, {toggleItem:i<3});
	}
	//tb.getItem("wikiword").setLabel("WikiWord");
	var headings = dojo.widget.createWidget("ToolbarSelect", {
		name: "formatBlock",
		values: {
			"Normal": "p",
			"Heading 1": "h1"
		}
	});
	dojo.event.connect(headings, "onSetValue", function(item, val) {
		alert(item + "\n" + val);
	});
	tb.addChild(headings);
	var timeSpent = (new Date() - now);
	dojo.debug("Total build time: " + timeSpent);
	return timeSpent;
}

dojo.event.connect(dojo, "loaded", function() {
	var total = 0;
	for(var i = 0; i < 1; i++) {
		total += init();
	}
	dojo.debug("Avg time: " + (total/i));
});
</script>

<body>
	Toolbar:
	<a href="javascript:tc.enable()">Enable</a> /
	<a href="javascript:tc.disable()">Disable</a>
	<br />
	Justification: 
	<a href="javascript:tc.enable('justify')">Enable</a> /
	<a href="javascript:tc.disable('justify')">Disable</a>

</body>
